<script lang="ts" setup>
import { ref, h, onMounted,render } from "vue";

// 创建一个模板引用，指向一个空的DOM元素作为挂载点
const containerRef = ref<HTMLElement | null>(null);

onMounted(() => {
  // 1. 使用 h 函数创建虚拟节点 (VNode)
  const vnode = h('span', { class: ''},'呵呵');
  
  // 2. 检查挂载点是否存在
  if (containerRef.value) {
    // 3. 使用 Vue 的运行时渲染器将 VNode 渲染为真实 DOM 并挂载
    render(vnode, containerRef.value);
  }
})
</script>

<template>
  <!-- 提供一个挂载点 -->
  <div ref="containerRef"></div>
</template>